<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ page import="java.util.*"%>
<%@ include file="/WEB-INF/jsp/common/taglib.jsp"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>customer_index</title>
<script src="<c:url value="/ui/jquery-1.10.2.js" />"></script>
<script src="<c:url value="/ui/jquery-migrate-1.2.1.js" />"></script>

<link rel="stylesheet" href="<c:url value="/demo/jquery.ui.all.css"/>">
<link href="<s:url value="/css/standard.css" />" rel="stylesheet"
	type="text/css" />
<link href="<s:url value="/css/pop_up.css" />" rel="stylesheet"
	type="text/css" />
<link href="<s:url value="/css/maintenance.css" />" rel="stylesheet"
	type="text/css" />
<link href="<s:url value="/css/Simplemodal.css" />" rel="stylesheet"
	type="text/css" />



<script src='<c:url value="/js/common.js" />'></script>
<script src='<c:url value="/js/common_ui.js" />'></script>
<script src='<c:url value="/js/poplayer.js" />'></script>
<script src='<c:url value="/js/maint_ui.js" />'></script>
<script src='<c:url value="/js/jquery.form.js" />'></script>

<script src="<c:url value="/ui/jquery.ui.core.js" />"></script>
<script src="<c:url value="/ui/jquery.ui.widget.js" />"></script>
<script src="<c:url value="/ui/jquery.ui.datepicker.js" />"></script>
<!--  <script src="<c:url value="/ui/jquery-ui-timepicker-addon.js" />"></script>-->

<script src="<c:url value="/ui/jquery-ui-slide.min.js" />"></script>
<link rel="stylesheet" href="<c:url value="/demo/demos.css" />">
<link rel="stylesheet" href="<c:url value="/demo/dateTime.css" />">

<script type="text/javascript">
$(function() {

	$('.example').datepicker({
		changeMonth : true,
		changeYear : true
	});

})
</script>


</head>
<body>
	<div class="pageVar">
		<c:set var='pageIndex' value='${pageIndex}' />
		<c:set var='pageSize' value="${pageSize}" />
		<c:set var='totalPage' value="${totalPage}" />

		<c:set var='changePercent' value="0.7" />
		<c:set var='changeStepSize' value="1" />


		<c:set var='starPageIndex' value="0" />
		<c:set var='endPageIndex' value="${pageSize}" />
		<c:set var='changeStep' value="0" />

		<c:if test="${pageIndex >= pageSize * changePercent}">
			<c:set var='changeStep'
				value="${
					 ( 
			 			(pageIndex - endPageIndex * changePercent + 1) 
							-
							(pageIndex - endPageIndex * changePercent + 1) %1 ) * changeStepSize}" />
			<!-- 减去自身的余数*增加页数值 -->

		</c:if>

		<c:set var="starPageIndex" value="${starPageIndex+changeStep}"></c:set>

		<c:set var="endPageIndex" value="${endPageIndex+changeStep}"></c:set>

		<c:set var="needEndValue" value="true" />

		<c:if test="${endPageIndex >= totalPage}">
			<c:set var="endPageIndex" value="${totalPage}" />
			<c:set var="needEndValue" value="false" />
		</c:if>


		<c:set var="isShowOmitSign" value="false" />

		<c:if test="${needEndValue}">

			<c:set var="isShowOmitSign" value="${totalPage > (endPageIndex)}" />


		</c:if>

	</div>
	<form:form name="deleteForm" method="delete">
		<input type="hidden" name="id" id ="id">
	</form:form>

	<form:form name="toPage" method="get">
		<input type="hidden" name="name" value="${conditionQuery.name}">
		<input type="hidden" name='level' value="${conditionQuery.level}">
		<input type="hidden" name='district'
			value="${conditionQuery.district}">
		<input type="hidden" id="pageIndex" name="pageIndex" value="">
	</form:form>
	<form:form name=" skip">
		<input type="hidden" id="skipPageIndex" name="skipPageIndex"
			value="${pageIndex} ">
		<input type="hidden" id="totalPage" name="totalPage"
			value="${totalPage} ">
	</form:form>

	<div class="search">
		<form:form method="get" name="searchForm">
			<table width="100%" border="0" cellspacing="0" cellpadding="0">
				<tr>
					<td height="35px">&nbsp&nbsp 姓名:<input type="text" name="name"
						value="${conditionQuery.name}"> 等级: <select name='level'>
							<option value="All"
								<c:if test="${conditionQuery.level == 'All'}">selected</c:if>>All</option>
							<option value="first"
								<c:if test="${conditionQuery.level == 'first'}">selected</c:if>>first</option>
							<option value="second"
								<c:if test="${conditionQuery.level == 'second'}">selected</c:if>>second</option>
							<option value="third"
								<c:if test="${conditionQuery.level == 'third'}">selected</c:if>>third</option>

					</select> 区域 <select name='district'>
							<option value="All"
								<c:if test="${conditionQuery.district == 'All'}">selected</c:if>>All</option>
							<option value="South China"
								<c:if test="${conditionQuery.district == 'South China'}">selected</c:if>>South
								China</option>
							<option value="North China"
								<c:if test="${conditionQuery.district == 'North China'}">selected</c:if>>North
								China</option>
							<option value="West China"
								<c:if test="${conditionQuery.district == 'West China'}">selected</c:if>>West
								China</option>
							<option value="East China"
								<c:if test="${conditionQuery.district == 'East China'}">selected</c:if>>East
								China</option>
					</select> <input type='submit' onclick="search()" value=' 查询 ' />
					</td>
				</tr>
			</table>
		</form:form>
	</div>


	<div class="Info">
		<table width="100%" border="0" cellspacing="0" cellpadding="0">
			<tr>
				<td width="7" align="left" valign="top" height="7"><img
					src="<s:url value="/images/corner_left_top_m.gif"/>" width="7"
					height="7" /></td>
				<td class="topBorderMain"><img
					src="<s:url value="/images/spacer.gif" />" /></td>
				<td width="7" align="right" valign="top"><img
					src="<s:url value="/images/corner_right_top_m.gif" />" /></td>
			</tr>

			<tr>
				<th colspan="4" class="mainFormTitle">客户信息</th>
			</tr>

			<tr>
				<td colspan="4" class="leftRightBorderMain">

					<table cellpadding="0" cellspacing="0" class="invoiceButton">
						<tr>
							<td><img src="<s:url value="/images/btn_add.gif"/>"
								name="btn_add.gif" align="absbottom" /> <a
								href="javascript:location.href='<c:url value='/customer/add' />'"
								style="font-size: 15px; text-decoration: none">新增 </a></td>
						</tr>
					</table>
					<table id="radiotable" class="mainGrid" width="100%" border="0"
						cellpadding="0" cellspacing="0">
						<thead>
							<tr>

								<th width="150px">公司名称</th>
								<th width="100px">电话</th>
								<th width="150px">地址</th>
								<th width="180px">传真</th>
								<th width="120px">等级</th>
								<th width="120px">区域</th>
								<th width="80px">编辑</th>
							</tr>
						</thead>
						<tbody>
							<c:forEach items="${ list }" var="customer" varStatus="status">
								<tr id="radiotable_tr_<c:out value="${status.index}"/>">


									<td align='center' style="word-break: break-all;"><a
										href="javascript:location.href='<c:url value='/customer/${ customer.id }/view' />'"
										style="text-decoration: none"><c:out
												value="${ customer.name }" /></a></td>


									<td align='center' style="word-break: break-all;"><c:out
											value="${ customer.tel }" /></td>
									<td align='center' style="word-break: break-all;"><c:out
											value="${ customer.address }" /></td>
									<td align='center'
										style="word-break: break-all; text-align: center;"><c:out
											value="${ customer.fax }" /></td>
									<td align='center' style="word-break: break-all;"><c:out
											value="${ customer.level }" /></td>
									<td align='center' style="word-break: break-all;"><c:out
											value="${ customer.district }" /></td>


									<td align='center' style="white-space: nowrap;"><a
										href="javascript:void(0);"
										onclick="location.href='<c:url value='/customer/${ customer.id }/edit' />'"><img
											src="<s:url value="/images/btn_edit.gif"/>"
											name="btn_edit.gif" alt="Edit" title="Edit" width="18"
											height="20" hspace="3" vspace="3" border="0"
											align="absmiddle" /></a> <a href="javascript:void(0);"
										onclick="deleteDemo('<c:out value='${ customer.id }'/>')"><img
											src="<s:url value="/images/btn_remove.gif"/>"
											name="btn_remove.gif" alt="Remove" title="Remove" width="18"
											height="20" hspace="3" vspace="3" border="0"
											align="absmiddle" /></a></td>
								</tr>
							</c:forEach>

							<c:if test="${ list == null || fn:length(list) == 0}">
								<tr id="radiotable_tr_<c:out value="${status.index}"/>">
									<td colspan='99' align='center'><font color='red'>no
											recored.</font></td>
								</tr>
							</c:if>
						</tbody>
					</table>
				</td>
			</tr>
			<tr>
				<th colspan="4" class="mainFormbtn">
					<table cellpadding="0" cellspacing="0" width="100%">
						<tr>
							<td align="center">
								<table width="100%" border="0" cellspacing="0" cellpadding="0">
									<tr>
										<td align="center"><div class="pageColumn">
												<table width="100%">
													<td align="center"><form:form action="page"> 
																		页数：【    ${pageIndex+1} 】<a
																style="text-decoration: none;"
																<c:choose>
																
																 <c:when test="${pageIndex > 1}"> 
																href="javascript:goPage('${pageIndex-1}')"
																</c:when>
													
  					             					 			<c:otherwise>
  					             					 				 href="javascript:goPage('0')"
   															</c:otherwise>
   															
   																		</c:choose>>
																【上一页】</a>
															<a
																<c:choose>
																
																 <c:when test="${pageIndex+1 == totalPage}"> 
																href="javascript:goPage('${pageIndex}')"
																</c:when>
													
  					             					 			<c:otherwise>
  					             					 				 href="javascript:goPage('${pageIndex+1}')"
   															</c:otherwise>
   															
   																		</c:choose>
																style="text-decoration: none">【下一页】</a> 
														总页数：${totalPage}  &nbsp 跳转     <input
																style="text-align: center;" size="1" name="amount"
																value="" type="text" id="skip">
															<a
																style="text-decoration: none; font-size: 15px; cursor: pointer;"
																onclick="skip()">确定 </a>
														</form:form></td>

												</table>

											</div></td>
									</tr>
								</table>
							</td>
						</tr>
					</table>
				</th>
			</tr>
			
			<tr>
				<td align="left" valign="bottom" height="7" width="7"><img
					src="<s:url value="/images/corner_left_bottom_m.gif"/>" /></td>
				<td class="bottomBorderMain"><img
					src="<s:url value="/images/spacer.gif"/>" /></td>
				<td align="right" valign="bottom" height="7" width="7"><img
					src="<s:url value="/images/corner_right_bottom_m.gif"/>" /></td>
			</tr>
		</table>

	</div>




	<script type="text/javascript">
	
	function deleteDemo(id){
		if(confirm("你确定删除此记录吗?")){
			$('#id').val(id);
			deleteForm.action="<c:url value='/customer/'/>" + id ;
			deleteForm.submit();
		}
	}
	
	function goPage(pageIndex){
		$('#pageIndex').val(pageIndex);
		toPage.action="<c:url value='/customer/page'/>";
		
		toPage.submit();
	}
	
	function search() {
		searchForm.action="<c:url value='/customer/page'/>";
		searchForm.submit();
	}
	
	function skip(){
		
		var skip =$("#skip").val();
		var skipPageIndex = $('#skipPageIndex').val();
		var totalPage = $('#totalPage').val();
		
		if(skip.split("").length<1){
			
			goPage(skipPageIndex);
		}
		else  if(skip.split("").length>totalPage.split("").length){
		
			totalPage = totalPage-1
			goPage(totalPage);
			
		}else if(skip>totalPage){
			
			totalPage = totalPage-1
			goPage(totalPage);
			
			}
			if(skip.split("").length>0 & skip.split("").length <= totalPage.split("").length)
			{
				skip = skip-1
				
			goPage(skip);}
	}
</script>

</body>
</html>